import { reactive,ref,getCurrentInstance } from "vue";
import {GJ_nowTime } from "../../../static/js/tool.js";
function chatroomJS() {
    // 聊天列表 用来获取可视化高度
    let msgbox =  ref(null);
    // 滚动消息列表盒子
    let box =  ref(null);
    let {proxy:then} = getCurrentInstance();
    let status = reactive({
        msg: "",
        // 聊天框高度
        heights: "",
        //   在线列表
        userOnline: [],
        // 自己信息
        userinfo: JSON.parse(window.sessionStorage.getItem("userinfo")),
        systemMsg: {
            //广播的消息
            message: "",
            // 广播的类型
            type: "",
            // 广播的紧急程度
            deep: "",
        },
        // 聊天消息列表
        msglist: []
    });
    let methodFun = {
        //建立长链接
        longLink: () => {
            // 进入群聊
            then.$socket.emit("login", status.userinfo);
            // 返回在线列表
            then.$socket.on("online", (data) => {
                status.userOnline = data;
            });
        },
        //发送消息
        send: () => {
            let sendData = {
                id:
                    status.userinfo.user +
                    GJ_nowTime("s","-") +
                    (Math.random() * (Math.random() * 100)).toFixed(6),
                user: status.userinfo.user,
                userName: status.userinfo.userName,
                userImage: status.userinfo.userHeader,
                toUser: "all",
                type: "all",
                message: status.msg,
                createTime: GJ_nowTime("date-time","-"),
            };
            then.$socket.emit("userSend", sendData);
            setTimeout(() => {
                methodFun.updata();
            }, 10);
            status.msg = "";
        },
        // 更新消息
        updata: () => {
            let mearr = document.getElementsByClassName("me");
            let len = mearr.length;
            status.heights = 0;
            for (let i = 0; i < len; i++) {
                let height = parseInt(window.getComputedStyle(mearr[i]).height) + 12;
                status.heights += height;
            }
            box.value.scrollIntoView(false);
        }
    }
    return {
        msgbox,
        box,
        then,
        status,
        methodFun
    }
}

export default chatroomJS;